<nz-spin *ngIf="isLoading" class="modal-spin"></nz-spin>
<form nz-form *ngIf="!isLoading" [formGroup]="validateForm" (ngSubmit)="submitForm()">
  <nz-form-item>
    <nz-form-label [nzSpan]="6" nzRequired nzFor="mainImg">客服二维码</nz-form-label>
    <nz-form-control [nzSpan]="18" [nzValidateStatus]="validateForm.controls['mainImg']">
      <input type="text" nz-input formControlName="mainImg" placeholder="客服二维码" style="display: none;">
      <nz-upload class="upload-list-inline"
                 [nzMultiple]="true"
                 [nzAction]="uploadDomain"
                 [nzHeaders]="headers"
                 (nzChange)="handleChange($event)"
                 [nzSize]="2048"
                 nzAccept=".jpg,.jpeg,.png,.gif"
                 nzListType="picture-card"
                 [nzShowUploadList]="false">
        <ng-container *ngIf="!entity.mainImg">
          <i class="anticon anticon-plus"></i>
          <div class="ant-upload-text">上传二维码</div>
        </ng-container>
        <img *ngIf="entity.mainImg" [src]="entity.mainImg|qCloudDomain" title="点击可修改客服二维码" class="avatar">
      </nz-upload>
      <nz-form-explain *ngIf="validateForm.get('mainImg').dirty && validateForm.get('mainImg').hasError('required')">
        请选择客服二维码
      </nz-form-explain>
      <nz-form-extra style="color: orange;">请上传小于2MB的图片, 且为了最佳移动端视觉效果，我们建议您添加大小约600*800的图片</nz-form-extra>
    </nz-form-control>
  </nz-form-item>
  <nz-form-item>
    <nz-form-label [nzSpan]="6" nzRequired nzFor="remark">备注</nz-form-label>
    <nz-form-control [nzSpan]="18" [nzValidateStatus]="validateForm.controls['remark']">
      <textarea rows="6" nz-input formControlName="remark" placeholder="备注"></textarea>
      <nz-form-explain *ngIf="validateForm.get('remark').dirty && validateForm.get('remark').hasError('required')">请输入备注</nz-form-explain>
      <nz-form-explain *ngIf="validateForm.get('remark').dirty && validateForm.get('remark').hasError('maxlength')">不能超过100个字</nz-form-explain>
    </nz-form-control>
  </nz-form-item>
  <div class="modal-footer">
    <button nz-button type="button" (click)="close()">关闭</button>
    <button nz-button type="submit" [nzType]="'primary'" >保存</button>
  </div>
</form>
